<template>
  <div class="wrapper">
    <h4 class="title">订单信息</h4>
    <p>
      <span>订单编号：</span>{{orderInfo.payNum}}</p>
    <p>
      <span>付款金额：</span>
      <span class="price"
        v-if="orderInfo.money">￥{{orderInfo.money}}</span>
    </p>
    <p>
      <span>下单时间：</span>{{orderInfo.orderTime}}</p>
    <p>
      <span>购买人：</span>{{orderInfo.userName}}</p>
    <p>
      <span> 联系电话：</span>{{orderInfo.phone}}</p>
    <p>
      <span>推荐人：</span>{{orderInfo.operatorName}}</p>
    <h4 class="title">购券明细</h4>
    <p>
      <span>归属团购券活动：</span>{{orderInfo.title}}</p>
    <div class="clearfix"
      style="padding-left:30px">
      <span class="fl">商品列表：</span>
      <div class="fl">
        <div v-for="(item,index) in orderInfo.commoditys"
          :key="index">{{item.name}} x{{item.num}}</div>
      </div>
    </div>
  </div>
</template>

<script>
import { Orderinfo } from "@/public/js/saleRoom.js";
export default {
  components: {},
  props: ["id"],
  data() {
    return {
      orderInfo: {}
    };
  },
  watch: {},
  computed: {},
  methods: {
    orderDetail() {
      Orderinfo({
        id: this.id
      }).then(res => {
        this.orderInfo = res.data.orderInfo;
      });
    }
  },
  created() {
    this.orderDetail();
  },
  mounted() {}
};
</script>
<style lang="scss" scoped>
.title {
  color: #6d2377;
}
.price {
  color: red;
}
p {
  line-height: 26px;
  padding-left: 30px;
}
</style>